<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>home</title>
    <link rel="stylesheet" href="style.css">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
</head>
<body>
    <div class="header">
        <div class="contoiner">
                <img style="width: 60px;height: 18px" src="img/brand-white.png" alt="">
                <ul>
                    <li><a href="">home</a></li>
                    <li><a href="">Profile</a></li>
                    <li><a href="">Messages</a></li>
                    <li><a href="">Docs</a></li>
                </ul>
        </div>
    </div>
    <div class="item">
        <div class="contoiner">
            <div class="left">
                <div class="left-top" style="position: relative">
                    <img src="img/iceland.jpg" alt="" class="iceland">
                    <div class="top1">
                        <img src="img/avatar-dhg.png" alt="" class="dhg">
                        <h5>Dave Gamache</h5>
                        <p>I wish i was a little
                            bit taller.wish i<br> was a baller.</p>
                    </div>
                </div>
                <div class="left-center">
                    <h5>About</h5>
                    <p>Went to <a href="" class="left-center-span">Oh,Canada</a></p>
                    <p>Became friends with <a href="" class="left-center-span">Obama</a></p>
                    <p>Work at <a href="" class="left-center-span">Github</a></p>
                    <p>Lives in <a href="" class="left-center-span">San Franciso,CA</a></p>
                    <p>From <a href="" class="left-center-span">Seattle.WA</a></p>
                </div>
                <div class="left-bottom">
                    <h5>Photos</h5>
                    <img src="img/instagram_5.jpg" alt="" class="lb-1">
                    <img src="img/instagram_6.jpg" alt="" class="lb-2">
                    <img src="img/instagram_7.jpg" alt="" class="lb-3">
                    <img src="img/instagram_8.jpg" alt="" class="lb-4">
                    <img src="img/instagram_9.jpg" alt="" class="lb-5">
                    <img src="img/instagram_10.jpg" alt="" class="lb-6">
                </div>

            </div>
            <div class="center">
                <div class="center-top">
                    <h5 class="dave">Dave Gamache</h5>
                    <span class="si">4min</span>
                    <p>Aenesn lacinia bibendum nulla sed consectetur. Vestibulum id ligula porta fells
                        eusimod semper.Morbi ieo risus, porta ac consectur ac. vestibulum ac eros.Cras
                        justo odio.dapibus ac facilisis in,egestas eget quam.vestibulum id ligyla porta felis
                        euismod semper.Cum socils natoque penatibus et magnis dis parturient.montes,
                        nascetur ridicuius mus.
                    </p>
                    <img src="img/unsplash_1.jpg" alt="" class="ct-1">
                    <img src="img/instagram_1.jpg" alt="" class="ct-2">
                    <img src="img/instagram_13.jpg" alt="" class="ct-3">
                    <img src="img/unsplash_2.jpg" alt="" class="ct-4">
                    <p class="p1"><a class="ct-span">Jacon Thornton:</a>Donec id elit non mi porta gravida at eget metus.
                        Vivamus sagittis lacus velaugue laoreet rutrum faucibus dolor auctor.
                        Donec ullamcorper nulla non metus auctor fringilla.
                        Prasent commodo cursus magan,vel scelerisque nisl consectetur et.
                        Sed posuere consectetur est at lobortis.
                    </p>
                    <p class="p2"><a class="ct-span">Mark Otto:</a> Lorem ipsum dolor sit amet,
                        consectetur adipiscing elit.Fusce dapibus,
                        tellus ac cursus commodo,tortor mauris condimentum nibh,
                        ut fermentum massa justo sit amet risus.
                    </p>
                </div>
                <div class="center-center">
                    <h5>Jacob Thornton </h5>
                    <span class="si"> 12 min</span>
                    <p>Donecc id elit non mi porta gravida at eget metus.
                        Integer posuere erat a ante venenatis dapibus posuere velit aliquet.
                        Cum sociis natoque penatibus et magnis dis parturient montes,
                        nascetur ridiculus mus.Morbi leo risus,porta ac consecteturac,
                        vestibulum at eros.Lorem ipsum dolor sit amet,consectetur adipiscing elit.
                    </p>
                </div>
                <div class="center-bottom">
                    <h5 class="tt">Mark Otto</h5>
                    <span class="si">34 min</span>
                    <p class="p1">Donec ullamcorper nulla non metus auctor fringilla.
                        Vestibulum id lighla porta felis euismod semper.Aenean eu leo quam.Pellentesque ornare sem lacinia quam venenatis vestibulum.
                        Etiam porta sem malesuada magna mollis equismod.Donec sed odio dui.
                    </p>
                    <img src="img/instagram_3.jpg" alt="">
                    <p class="p2">
                        <a href="" class="yy">Dave Gamache:</a>
                        Donec id elit non mi porta gravida at eget metus. Vivamus
                        sagittis lacus vel aygue laoreet rutrum faucibus dolor actor.
                        Donec ullamcorper nulla nonmetus auctor fringilla.Praesent commodo cursus magna.Vel scelerisque nisl
                        consectetur et.Sed posuere consectetur est at lobortis.
                    </p>
                </div>
            </div>
            <div class="right">
                <div class="right-top">
                    <h5>Sponsored</h5>
                    <img src="img/instagram_2.jpg" alt="">
                    <p class="p1">It might be time to visit lceland.</p>
                    <p class="p2">
                        Iceland is so chill,and everything<br>
                        looks cool here.Also.we heard <br>the
                        people are pretty nice.What<br> are you
                        waiting for?
                    </p>
                    <a href="">Buy a ticket</a>
                </div>
                <div class="right-bottom">
                    <h5>Likes</h5>
                    <img class="img1" src="img/avatar-fat.jpg" alt="">
                <span>
                    <p class="p1">Jacob Thorntons<a href="" class="a1">@fat</a></p>
                    <a href="" class="a11">Follow</a>
                </span><br>
                    <img class="img2" src="img/avatar-mdo.png" alt="">
                <span>
                    <p class="p1">Mark Otto<a href="" class="a1">@mdo</a></p>
                    <a href="" class="a11">Follow</a>
                </span>
                </div>
                <div class="ar">
                    <p>Dave really likes these nerds,no<br> one
                        knows why though.
                    </p>
                </div>
            </div>
        </div>
    </div>

    <div class="footer">
        <p>Designed and built with all the love inthe world by<a href="" class="a2">@mdo,@fat</a>,and<a href="" class="a2">@dhg</a></p>
        <ul>
            <li><a href="">About</a></li>
            <li><a href="" class="a3">Terms</a></li>
            <li><a href="" class="a3">Privacy</a></li>
            <li><a href="" class="a3">Licenses</a></li>
            <li><a href="" class="a3">FAQ</a></li>
        </ul>
    </div>
</body>
</html>